import DescriptionList from '@/components/DescriptionList'

const { Description } = DescriptionList

// 东风流量
const DFPVFlow = ({ flow, showSimDetail }) => {
  const { monthUsedFlow, monthBalanceFlow, msisdn } = flow
  return (
    <DescriptionList title='流量信息' col={3} style={{ marginBottom: 16 }}>
      <Description term="SIM卡号">
        <a onClick={() => showSimDetail(msisdn)}>{msisdn}</a>
      </Description>
      <Description term="本月已用流量">{monthUsedFlow ? `${monthUsedFlow} M` : ''}</Description>
      <Description term="本月剩余流量">{monthBalanceFlow ? `${monthBalanceFlow} M` : ''}</Description>
    </DescriptionList>
  )
}

// 北汽流量  五菱复用
const BAICFlow = ({ flow,showSimDetail }) => {
  const {
    flowData, msisdn,
  } = flow
  return (
    <DescriptionList title='流量信息' col={3} style={{ marginBottom: 16 }}>
      <Description term="SIM卡号">
        <a onClick={() => showSimDetail(msisdn)}>{msisdn}</a>
      </Description>
      <Description term="时长卡到期时间">{flowData ? flowData.service_expired_time : ""}</Description>
      <Description term="包时长套餐名字">{flowData ? flowData.using_service_package : ""}</Description>
      <Description term="包时套餐过期时间">{flowData ? flowData.using_service_expired_time : ""}</Description>
      <Description term="SIM卡状态">{flowData ? flowData.simstate : ""}</Description>
    </DescriptionList>
  )
}

// 海马流量
const HAIMAFlow = ({ flow, showSimDetail }) => {
  const { msisdn, hmFlowData } = flow;
  const apnFlow = hmFlowData && hmFlowData.apnFlowList && hmFlowData.apnFlowList.length > 0 ? hmFlowData.apnFlowList[0] : null;
  const packageList = hmFlowData && hmFlowData.packageList && hmFlowData.packageList.length > 0 ? hmFlowData.packageList : [];
  let packageName = null;
  packageList.map(item =>{
    if(item.package_type.value !== 4){
      packageName = item.package_name;
    }
  });
  return (
    <DescriptionList title='流量信息' col={3} style={{ marginBottom: 16 }}>
      <Description term="SIM卡号">
        <a onClick={() => showSimDetail(msisdn)}>{msisdn}</a>
      </Description>
      <Description term="本月已用流量">{ apnFlow && apnFlow.flow_use >= 0  ? (apnFlow.flow_use/1024).toFixed(2) +"Mb" : "" }</Description>
      <Description term="本月剩余流量">{ apnFlow && apnFlow.flow_surplus >= 0 ?(apnFlow.flow_surplus/1024).toFixed(2) +"Mb" : "" }</Description>
      <Description term="所处流量套餐期">{ packageName }</Description>
      <Description term="个人实名认证">{flow.realNameAuth!=null && (flow.realNameAuth ? "已实名" : "未实名")}</Description>
    </DescriptionList>
  )
}

// 最后返回的VehicleFlow
const VehicleFlow = ({ flow, brandId, showSimDetail }) => {
  // 使用Map用于解耦和减少判断
  const flowMap = new Map([
    ['DFPV', <DFPVFlow flow={flow} showSimDetail={showSimDetail} />],
    ['BAIC', <BAICFlow flow={flow} showSimDetail={showSimDetail} />],
    ['HAIMA', <HAIMAFlow flow={flow} showSimDetail={showSimDetail} />],
    ['SGMW', <BAICFlow flow={flow} showSimDetail={showSimDetail} />],
    ['BJEV', <BAICFlow flow={flow} showSimDetail={showSimDetail} />],
    ['PEUGEOT', <DFPVFlow flow={flow} showSimDetail={showSimDetail} />],
    ['DCAD', <DFPVFlow flow={flow} showSimDetail={showSimDetail} />],
    ['SINOMACH', <DFPVFlow flow={flow} showSimDetail={showSimDetail} />],
  ])
  return flowMap.get(brandId) ? flowMap.get(brandId) :  <DFPVFlow flow={flow} showSimDetail={showSimDetail} />
}

export default VehicleFlow



